<template>
  <div>
      <p class="tou">
          <span class="iconfont icon-huangguan"> </span>
          <span>权益专区</span>
      </p>
      <div class="shang">
          <span @click="fun('Putong')">普通会员</span>
          <span @click="fun('Xinxiang')">心享会员</span>
      </div>
      <keep-alive>
          <component :is="com"></component>
      </keep-alive>
  </div>
</template>

<script>
import Putong from "@/components/huiyuan/quanyi/putong.vue"
import Xinxiang from "@/components/huiyuan/quanyi/xinxiang.vue"
export default {
    data(){
        return{
            com:"Putong"
        }
    },
    methods:{
        fun(data){
            this.com = data
        }
    },
    components:{
        Xinxiang,
        Putong
    }
}
</script>

<style scoped>
    .tou{
        margin: .2rem 0 .2rem .1rem;
    }
    .shang{
        display: flex;
        justify-content: space-around;
    }
</style>